<template>
  <CDialog
    :visible="visible"
    :title="title"
    :loading="loading"
    type="add"
    width="630px"
    @submit="handleSubmit"
    @cancel="handleCancel"
    @outerOpen="outerOpen"
  >
    <div class="refuse-apply-dlg_remark" v-if="type === 'PASS'">
      您确定要通过商户:{{ userName }}的申请吗
    </div>
    <div class="refuse-apply-dlg_remark" v-else>驳回申请</div>
    <i-form :items="items" :model="form" ref="form"> </i-form>
  </CDialog>
</template>
<script>
import { approvalApply } from '@/api/user'
import CDialog from '@/components/CDialog'
export default {
  name: 'RefuseApplyDlg',
  components: { CDialog },
  props: {
    visible: {
      required: true,
      type: Boolean,
    },
    id: {
      required: true,
      type: [String, Number],
    },
    type: {
      required: true,
      type: String,
    },
    userName: {
      required: true,
      type: String,
    },
  },
  data() {
    return {
      title: '',
      items: [
        {
          label: '备注：',
          value: 'approvalRemark',
          type: 'text',
          placeholder: '请输入原因',
          'show-word-limit': true,
          maxlength: 30,
          required: true,
          clearable: true,
        },
      ],
      form: {},
      loading: false,
    }
  },
  methods: {
    handleCancel() {
      this.$emit('update:visible', false)
    },
    handleSubmit() {
      this.$refs.form.validate((valid) => {
        if (!valid) return
        this.loading = true

        approvalApply({
          ...this.form,
          id: this.id,
          approval: this.type,
        }).then(
          () => {
            this.$message({
              showClose: true,
              message: '操作成功',
              type: 'success',
            })
            this.loading = false
            this.$emit('update:visible', false)
            this.$router.push('/user/applyReviewList')
          },
          () => {
            this.loading = false
          }
        )
      })
    },
    outerOpen() {
      this.form = {
        approval: 'REFUSE',
      }

      if (this.type === 'PASS') {
        this.title = '通过申请'
      } else {
        this.title = '申请驳回'
      }

      this.$nextTick(() => {
        this.$refs.form.clearValidate()
      })
    },
  },
}
</script>
<style lang="scss" scoped>
.refuse-apply-dlg_remark {
  text-align: center;
  font-weight: bold;
  padding: 0 0 20px 0;
}
</style>
